<template>
  <div>
    <criteria-paged :model="model" v-ref:paged>
      <criteria partial='criteria' @condition-changed='search'>
        <div novalidate class="form-inline auto" partial>
            <div class="form-group">
              <button class="btn btn-success width-80" @click="search()">刷新</button>
            </div>
            <div class="form-group">
              <button type="button" class="btn btn-default" @click="$parent.$parent.lastKnownPos">位置地图&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-map-marker"></span></button>
            </div>
          <div class="form-group">
            部门:
            <chooser :userid.sync='$parent.$parent.loginer.id' resource-type="organization" :width='200' :select-data.sync='$parent.$parent.model.chosenOrg'></chooser>
          </div>
          {{$parent.$parent.model.chosenOrg.fullname}}
        </div>
        <!-- <div class="form-group">
          <v-select
            :value.sync="model.chosenOrg"
            v-model='model.chosenOrg'
            :options='chosenOrgType'
            placeholder='部&nbsp;&nbsp;门'
            condition="chosenOrg = '{}'"
            close-on-select>
          </v-select>
        </div> -->
      </criteria>
      <data-grid :model="model" partial='list' v-ref:grid>
        <template partial='head'>
          <tr>
            <th>时间</th>
            <th>手机使用者</th>
            <th>手机串码</th>
            <th>经度</th>
            <th>纬度</th>
            <th>海拔(米)</th>
            <th>电量%</th>
            <th>信号强度</th>
            <th>剩余空间M</th>
            <th>流量Kb</th>
          </tr>
        </template>
        <template partial='body'>
          <td>{{row.f_datetime}}</td>
          <td v-on:click.stop.prevent='$parent.$parent.$parent.footprint(row)'>{{row.f_user_name}}&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-option-horizontal"></span></td>
          <td>{{row.f_sn}}</td>
          <td>{{row.f_longitude}}</td>
          <td>{{row.f_latitude}}</td>
          <td>{{row.f_altitude}}</td>
          <td>{{row.f_battery_level}}</td>
          <td>{{row.f_signal_strength}}</td>
          <td>{{row.f_internal_quote}}</td>
          <td>{{row.f_traffic/1000}}</td>
        </template>
      </data-grid>
    </criteria-paged>
  </div>
</template>

<script>
import { PagedList } from 'vue-client'
import * as Util from '../Util'
export default {
  title: '足迹及手机状态监控',
  // props: ['f'],
  data () {
    let model = new PagedList('rs/rcq/最后在线位置及状态', 20, {f_loggedOnUserId: 'this.f_loggedOnUserId', f_loggedOnOrgId: 'this.chosenOrg.id'})
    model.chosenOrg = {id:0}
    return {
      model: model,
      loginer: Util.f
    }
  },
  methods: {
    lastKnownPos () {
      this.$goto('post-map', {lonlats: this.model.rows}, 'self')
    },
    footprint (row) {
      this.$goto('footprint-map', {f_user_id: row.f_user_id, f_user_name: row.f_user_name}, 'self')
    }
  },
  ready () {
    this.model.f_loggedOnUserId = this.loginer.id
    this.model.chosenOrg.id = this.loginer.parent.id
    this.model.search()
  }
}
</script>
